<template>
	<view>
		<u-popup v-model="show" mode="center" length="80%">
			<view class="popupcontain">
				<h2>修改名称</h2>
				<text class="popupcontain_2">请输入新的名称</text>
				<view class="popupcontain_3">
					<u-input v-model="value" :type="type" :border="border" />
				</view>
				<text class="popupcontain_4" @click="sumnit()">确定</text>
			</view>
		</u-popup>
		<view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>

<script>
	export default {
		name: "Popup1",
		data() {
			return {
				show: false,
				value: '',
				type: 'text',
				border: true,
				reallyName:''
			};
		},
		methods: {
			init(reallyName) {
				this.show = true
				this.value = reallyName
			},
			sumnit() {

				if (this.value == '') {
					this.$refs.uToast.show({
						title: '请输入组名',
						type: 'warning',
					})
				} else {
					this.$emit("add", this.value)
					this.show =false
					this.value = ''
				}
			},
		}
	}
</script>

<style>
	.popupcontain {
		border-top: 3px solid skyblue;
		width: 100%;
		height: 400rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 20rpx;
	}

	.popupcontain_2 {
		margin-top: 20rpx;
		font-size: 30rpx;
	}

	.popupcontain_3 {
		margin-top: 30rpx;
		background-color: #E4E7ED;
	}

	.popupcontain_4 {
		display: block;
		width: 100%;
		margin-top: 50rpx;
		height: 100rpx;
		border-top: 1px solid pink;
		text-align: center;
		font-weight: 600;
		line-height: 100rpx;
	}
</style>
